<!DOCTYPE html>
<html>
  
  <head>
    <meta charset="UTF-8">
    <title>秒杀活动列表</title>
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width,user-scalable=yes, minimum-scale=0.4, initial-scale=0.8,target-densitydpi=low-dpi" />
    <link rel="shortcut icon" href="/favicon.ico" type="image/x-icon" />
    <link rel="stylesheet" href="./css/font.css">
    <link rel="stylesheet" href="./css/xadmin.css">
    <link rel="stylesheet" href="./css/inputC.css">
    <script type="text/javascript" src="https://cdn.bootcss.com/jquery/3.2.1/jquery.min.js"></script>
    <script type="text/javascript" src="./lib/layui/layui.js" charset="utf-8"></script>
    <script type="text/javascript" src="./js/xadmin.js"></script>
    <!-- 引入layui.css -->
    <link rel="stylesheet" href="https://www.layuicdn.com/layui-v2.5.6/css/layui.css">
    <!-- 引入layui.js -->
    <script scr="https://www.layuicdn.com/layui-v2.5.6/layui.js"></script>
    <!-- 让IE8/9支持媒体查询，从而兼容栅格 -->
    <!--[if lt IE 9]>
      <script src="https://cdn.staticfile.org/html5shiv/r29/html5.min.js"></script>
      <script src="https://cdn.staticfile.org/respond.js/1.4.2/respond.min.js"></script>
    <![endif]-->
  </head>
  
  <body>
    <div class="x-nav">
      <span class="layui-breadcrumb">
      </span>
      <a class="layui-btn layui-btn-small" style="line-height:1.6em;margin-top:3px;float:right" href="javascript:location.replace(location.href);" title="刷新">
        <i class="layui-icon" style="line-height:30px">ဂ</i></a>
    </div>
              <xblock>
                <button class="layui-btn layui-btn-normal" onclick="x_admin_show('新增秒杀活动','./lightdeals-add.html',1200,600)" id="addCoupon"><i class="layui-icon layui-icon-add-1"></i>新增秒杀活动</button>
              </xblock>
      <script type="text/html" id="table-operation">
        <a class="layui-btn layui-btn-normal layui-btn-xs" lay-event="edit">编辑</a>
        {{# if(d.state == 0) { }}
        <a class="layui-btn layui-btn-warm layui-btn-xs" lay-event="close">关闭</a>
        {{# } else { }}
        <a class="layui-btn layui-btn-normal layui-btn-xs" lay-event="open">开启</a>
        {{# } }}
        <a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="del">删除</a>
      </script>

      <div style="text-align: center">
        <!--数据表格位置-->
        <table id="data-table" lay-filter="data-table"></table>
      </div>

    </div>


    <script>

      layui.use(['form','table','laypage','layer','laydate'], function() {
        var $ = layui.jquery
                ,form = layui.form,table = layui.table,laypage=layui.laypage,layer=layui.layer,laydate=layui.laydate;


    let couponTable=table.render({
          elem: "#data-table",
          url: "/lightdeals/getAllLightdeals",
          page: true, //开启分页
          id:"idTest",
          // width:1250,
          cols: [[
              {field: "lid",  title: "ID",hide:true},
              {field: "goods",  title: "商品",align: "center",templet: "#goodstitleimgTem"},
              {field: "gid",  title: "gid",align: "center",hide:true},
              {field: "goodstitle",  title: "goodstitle",align: "center",hide:true},
              {field: "starttime", title: "秒杀开始时间",align: "center"},
              {field: "endtime", title: "秒杀结束时间",align: "center"},
              {field: 'inventory', title: '库存', align: 'center',width: 150},
              {field: "price", title: "秒杀价格(元)",align: "center",width: 150},
              {field: "state", title: "状态",align: "center",templet: "#lightdealsStateTem",width: 150},
              {title: "操作", align: "center",toolbar: "#table-operation",width:200,}
            ]],
          done:function (res, curr, count) {
              console.log("coupon数据------------>")
              console.log(res)
          },
        });


        /*
        * 右侧工具类编辑、删除、查看等的点击事件函数
        * */
          table.on('tool(data-table)', function(obj) { //注：tool 是工具条事件名，data-table 是 table 原始容器的属性 lay-filter="对应的值"
              var data = obj.data; //获得当前行数据
              var layEvent = obj.event; //获得 lay-event 对应的值（也可以是表头的 event 参数对应的值）
              var tr = obj.tr; //获得当前行 tr 的 DOM 对象（如果有的话）
              console.log(data)
              var lid = data.lid;
              if (layEvent === 'close') { //关闭秒杀活动
                  //do somehing
                  $.ajax({
                      type: 'GET',
                      url: "/lightdeals/updateLightdealsState/" + lid + "/" + 1,
                      processData: false,
                      contentType: false,
                      async: false,
                      success: function (res) {
                          console.log(res);
                          layer.msg('已关闭', {icon: 1});
                          couponTable.reload()
                      }
                  })
              } else if (layEvent === 'del') { //删除
                  layer.confirm('真的删除行么', function (index) {
                      $.ajax({
                          type: 'GET',
                          url: '/lightdeals/delLightdeals/'+lid,
                          processData: false,
                          contentType: false,
                          async: false,
                          success: function (res) {
                              console.log(res);
                              layer.msg('删除成功', {icon: 1});
                              obj.del();
                          }
                      });
                  });
              } else if (layEvent === 'edit') { //编辑
                  //do something
                  //同步更新缓存对应的值
                  // x_admin_show('编辑优惠券','./coupon-edit.html',1200,600)
                  layer.open({
                      type: 2,
                      area: [1200+'px', 600 +'px'],
                      fix: false, //不固定
                      maxmin: true,
                      shadeClose: true,
                      shade:0.4,
                      title: '编辑优惠券',
                      content: './lightdeals-edit.html',
                      success: function (layero, index) {
                          var body = layer.getChildFrame('body', index);
                          body.find("#goodstitle").val(data.goodstitle);
                          body.find("#gid").val(data.gid);
                          body.find("#lid").val(data.lid);
                          body.find("#starttime").val(data.starttime);
                          body.find("#endtime").val(data.endtime);
                          body.find("#price").val(data.price);
                          body.find("#inventory").val(data.inventory);
                      }
                  });
              } else if (layEvent === 'open') { //开启秒杀活动
                  $.ajax({
                      type: 'GET',
                      url: "/lightdeals/updateLightdealsState/" + lid + "/" + 0,
                      processData: false,
                      contentType: false,
                      async: false,
                      success: function (res) {
                          console.log(res);
                          layer.msg('已开启', {icon: 1});
                          couponTable.reload()
                      }
                  })
              }
          });

      })//layui结束
    </script>
    <script type="text/html" id="imgtmp">
        <img src="{{d.couponimg}}" style="width:80px;height: 50px;">
    </script>
    <script type="text/html" id="lightdealsStateTem">
      {{# if(d.state == 0) { }}
      <button class="layui-btn layui-btn-normal layui-btn-xs">已开启</button>
      {{# } else { }}
      <button class="layui-btn layui-btn-warm layui-btn-xs">已关闭</button>
      {{# } }}
    </script>
    <script type="text/html" id="goodstitleimgTem">
        <img src="{{d.goodsimg}}" style="width:40px;height: 40px;">
        <span>{{d.goodstitle}}</span>
    </script>

  </body>

</html>